/**
 *	Copyright (C) 2014 3D Repo Ltd
 *
 *	This program is free software: you can redistribute it and/or modify
 *	it under the terms of the GNU Affero General Public License as
 *	published by the Free Software Foundation, either version 3 of the
 *	License, or (at your option) any later version.
 *
 *	This program is distributed in the hope that it will be useful,
 *	but WITHOUT ANY WARRANTY; without even the implied warranty of
 *	MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 *	GNU Affero General Public License for more details.
 *
 *	You should have received a copy of the GNU Affero General Public License
 *	along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */


@font-face {
	font-family: '3drepo-font';
	src: url('../fonts/3drepo.io.eot');
	src: url('../fonts/3drepo.io.eot?#iefix'),
		 url('../fonts/3drepo.io.woff') format('woff'),
		 url('../fonts/3drepo.io.ttf') format('truetype'),
		 url('../fonts/3drepo.io.svg#3drepo.io') format('svg');
	font-style: normal;
	font-weight: normal;
}

/* Material icons */
@font-face {
	font-family: 'Material Icons';
	font-style: normal;
	font-weight: 400;
	src: url('../fonts/external/MaterialIcons-Regular.eot'); /* For IE6-8 */
	src: local('Material Icons'),
	local('MaterialIcons-Regular'),
	url('../fonts/external/MaterialIcons-Regular.woff2') format('woff2'),
	url('../fonts/external/MaterialIcons-Regular.woff') format('woff'),
	url('../fonts/external/MaterialIcons-Regular.ttf') format('truetype');
}

.angular-material-icons {
	font-family: 'Material Icons';
	font-weight: normal;
	font-style: normal;
	font-size: 24px;  /* Preferred icon size */
	display: inline-block;
	line-height: 1;
	text-transform: none;
	letter-spacing: normal;
	word-wrap: normal;
	white-space: nowrap;
	direction: ltr;

	/* Support for all WebKit browsers. */
	-webkit-font-smoothing: antialiased;
	/* Support for Safari and Chrome. */
	text-rendering: optimizeLegibility;

	/* Support for Firefox. */
	-moz-osx-font-smoothing: grayscale;

	/* Support for IE. */
	font-feature-settings: 'liga';
}

body {
	margin : 0;
	padding : 0;
	-webkit-touch-callout: none;
	overflow-y: hidden;
}

.fill {
background: rgb(87,156,228); /* Old browsers */
background: -moz-linear-gradient(top,  rgb(87,156,228) 0%, rgb(130,206,242) 41%, rgb(207,236,254) 50%, rgb(210,235,252) 50%, rgb(229,232,233) 50%, rgb(231,231,231) 50%, rgb(206,206,206) 58%, rgb(195,195,195) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(87,156,228)), color-stop(41%,rgb(130,206,242)), color-stop(50%,rgb(207,236,254)), color-stop(50%,rgb(210,235,252)), color-stop(50%,rgb(229,232,233)), color-stop(50%,rgb(231,231,231)), color-stop(58%,rgb(206,206,206)), color-stop(100%,rgb(195,195,195))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgb(87,156,228) 0%,rgb(130,206,242) 41%,rgb(207,236,254) 50%,rgb(210,235,252) 50%,rgb(229,232,233) 50%,rgb(231,231,231) 50%,rgb(206,206,206) 58%,rgb(195,195,195) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgb(87,156,228) 0%,rgb(130,206,242) 41%,rgb(207,236,254) 50%,rgb(210,235,252) 50%,rgb(229,232,233) 50%,rgb(231,231,231) 50%,rgb(206,206,206) 58%,rgb(195,195,195) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgb(87,156,228) 0%,rgb(130,206,242) 41%,rgb(207,236,254) 50%,rgb(210,235,252) 50%,rgb(229,232,233) 50%,rgb(231,231,231) 50%,rgb(206,206,206) 58%,rgb(195,195,195) 100%); /* IE10+ */
background: linear-gradient(to bottom,	rgb(87,156,228) 0%,rgb(130,206,242) 41%,rgb(207,236,254) 50%,rgb(210,235,252) 50%,rgb(229,232,233) 50%,rgb(231,231,231) 50%,rgb(206,206,206) 58%,rgb(195,195,195) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#579ce4', endColorstr='#c3c3c3',GradientType=0 ); /* IE6-9 */

}


#popup {
	position: absolute;
	bottom: 10px;
	left: 10px;
	z-index: 1000;
	background-color: rgba(255, 255, 255, 0.2);
	width: 400px;
	padding: 10px;
	visibility: hidden;
}

#dist_name {
	visibility: hidden;
}
dd
#distance {
	visibility: hidden;
	color: red;
}


h1#logo {
	font-family: '3drepo-font', sans-serif;
	position: absolute;
	bottom: 0;
	right: 0.3em;
	z-index: 10;
	font-size: 600%;
}



h1#logo,
#x3dom-state-viewer,
.navbar-collapse a,
.dropdown-menu>li>a,
.dropdown-menu>li>a:hover,
.fancytree-selected span.fancytree-title,
.metadata-title,
span.fancytree-title{
	color: white;
	font-weight: 100;
	text-shadow: 0 0 1px #666, 1px 1px 1px #666;
}

#x3dom-state-viewer {
	top: 50px;
	background-color: transparent;
}

div#x3dom_logdiv.x3dom-logcontainer {
	background-color: rgba(50, 50, 50, 0.9);
	border : 0;
	bottom : 0;
	padding : 0;
	position : absolute;
	width : 100%;
}

.navbar.transparent.navbar-inverse .navbar-inner {
	background: rgba(0,0,0,0.4);
}


.scrollable-menu {
	height: auto;
	max-height: 200px;
	overflow-x: hidden;
}

.navbar-inverse.navbar-brand {
	max-width: 63%;
}


nav.navbar.transparent.navbar-inverse.navbar-fixed-top {
	background-color: transparent !important;
	border-color: transparent !important;
}

.nav>li>a:hover, .nav>li>a:focus {
	background-color: rgba(255,255,255,0.25);
}


.nav .open>a, .nav .open>a:hover, .nav .open>a:focus,
.navbar-nav>li>.dropdown-menu {
	background-color: rgba(0,0,0,0.5);
	border: none;
}

.dropdown-menu>li>a:hover {
	background-color: rgba(0,0,0,0.1);
}

.dropdown-menu {
	background-color: rgb(45,45,45);
	border-radius: none !important;
}

.fill {
	display:block;
	position:absolute;
	height:auto;
	bottom:0;
	top:0;
	left:0;
	right:0;
	//margin-top:50px; /* Set margin to your navbar height */
}


.measure-info {
	position: absolute;
	background-color: transparent;
	margin-top: 10px;
	margin-left: 10px;
}


.table tr {
	background-color: white;
}
.table tr:hover {
	background-color: #fff6c1;
}

/******************************************************************************/
/* Tree view stuff															  */
/******************************************************************************/

.treeview {
	position: relative;
}

.treeview-header{
	text-align: center;
	height: 100px;
}

ul.fancytree-container {
	background-color: transparent;
	overflow: hidden;
	font-size: 12pt;
	border: none !important;
	outline:none !important;
}

span.fancytree-title:hover {
	background-color: rgba(255,255,255,0.25);
	border-color:  rgba(255,255,255,0.25);
}

.treeview-body {
	/* Firefox */
	height: -moz-calc(100% - 120px);
	/* WebKit */
	height: -webkit-calc(100% - 120px);
	/* Opera */
	height: -o-calc(100% - 120px);
	/* Standard */
	height: calc(100% - 120px);
}

#filter {
	width: 100%;
	margin: 0;
}

.waypoint-viewport {
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
}

.treerow{
	margin-left: 10px;
	text-align: left !important;
}

.itemlabel{
	text-align: left !important;
	float: left;
	width: 400px !important;
	margin-left: 10px;
}

.itempricegroup{
	float: right;
	text-align: right !important;
	height: 20px;
	margin: 0px !important;
}

.itemprice{
	float: right;
	text-align: right !important;
	min-width: 20px;
	height: 20px !important;
	position: relative;
}

.priceinput{
	border: 1px solid #ccc;
	text-align: right;
	background: transparent;
	height: 20px !important;
	padding: 0px !important;
}

.icon{
	margin-right: 10px;
}

.linkicon{
	float: right;
	width: 10px;
	min-width: 10px;
	margin-left: 5px;
	position: relative;
	top: 2px;
}

.linkicon-disabled{
	float: right;
	width: 10px;
	min-width: 10px;
	margin-left: 5px;
	position: relative;
	top: 2px;
	opacity: 0.25;
}

#popup{
	visibility: hidden;
}

.ui-widget-content{
	background: rgba(0,0,0,0.5);
	visibility: hidden;
	z-index: 2500;
	top: 50px;
	right: 1px;
	padding: 5px;
	position: absolute;
}

.viewport,
.viewer
{
	width:100%;
	height: 100%;
	bottom: 0px;
	position: absolute;
	display: block;
	border: 0px;
	top: 0px;
}

#loginPage {
	position: absolute;
	width: 100%;
	height: 100%;
	background-size: cover;
	color: #ffffff;
}

#loginPage h2 {
	color: rgb(32, 65, 170);
}

#loginPage .row {
	margin-top: 50px;
}

#credentials-box input {
	margin-top: 10px;
	margin-bottom: 10px;
}

#credentials-box button {
	margin-left: 10px;
	text-transform: uppercase;
}

.metadata-title{
	border-bottom: 2px solid white;
	font-size: 110%;
	text-align: center;
}

.metadata-row {
	color: white;
	font-weight: 100;
	text-align: left;
	width: 50px;
}

#metadata {
	height: 100%;
}

#metadata .tr {
	text-align: left;
}

#calendarview {
	background-color: white;
	color: rgb(1,1,1);
	position: relative;
}

#issues button {
	background-color: transparent;
}

floating {
	font-family: sans-serif;
	color: red;
	font-weight: 100;
	text-align: center;
	position: absolute;
	cursor: pointer;
	pointer-events: none;
	border:   none;
	z-index:   15000;
	left:	  0px;
	top:	  0px;
}

.line {
	background: black;
	width:		1px;
	position:	absolute;
	height:		1px;
}

a:hover {
	text-decoration: none;
}

.nav, .pagination, .carousel, .panel-title a { cursor: pointer; }

/* header, footer stuff */
.mainrow {
	max-width: 80%;
	margin: 0 auto;
}

.modal-dialog {
	top: -300px;
	margin: auto;
}

/* Set the fixed height of the footer here */
#push,
#footer {
		height: 30px;
}
#footer {
  background-color: #FFF;
  font-size: 12px;
  color: #BBB;
  margin-top: 15px;
  line-height: 18px
}

.v-expand {
	position: relative;
	height: 100%;
}

.tight {
	margin: 0;
	padding: 0;
}

.logo-pad {
	padding: 10px;
}

header {
	background: rgba(5, 58, 165, 1.0);
	color: #ffffff;
}

.header {
	/*background: rgb(5, 58, 165);*/

	height: 60px;
	min-height: 60px;
	border-bottom: 1px solid #DDD;
}

.header-logo {
/*	background: #fafafa; */
	height: 60px;
}

.header ul li{
	height: 60px;
	min-height: 60px;
}

.header ul li a{
	height: 60px;
	min-height: 60px;
	vertical-align: middle;
	line-height: 30px;
}

#search-box {
	height: 34px;
	margin-top: 13px;
	min-width: 300px;
}

.loginButtons {
	height: 34px;
	margin-top: 13px;
}

/* general */

.container-fluid {
	margin-right: auto;
	margin-left: auto;
	//max-width: 960px; /* or 950px */
}

.padded-box{
	padding: 10px 20px;
}

.padded-top {
	padding-top: 10px;
}

.shadow{
	box-shadow: 2px 2px 2px #CCCCCC;
}

.gutter-right{
	padding-right: 20px !important;
}

.rounded{
	border-radius: 3px;
}

.solid{
	background-color: #FFF;
}

.rounded-border{
	border-radius: 3px;
  border: 1px solid;
  border-color: #DDD;
}

.pagination{
	padding-left: 0px;
	padding-bottom: 0px;
	margin-bottom: 20px;
	margin-top: 0px;
}

.block{
	background-color: #FFF;
	float: left;
	padding-left: 0px;
	width: 100%;
	padding-bottom: 0px;
	margin-bottom: 20px;
}

.block p{
	height: 100%;
	font-weight: normal;
	color: #555;
	margin: 0px;
	padding: 10px;
}

.block-header{
	float: left;
	padding-left: 0px;
	padding-right: 0px;
	width: 100%;
	text-transform: uppercase;
}

hr {
	padding: 0px;
	margin: 10px 0px;
}

.block-header-project-name{
	font-weight: bold;
	color: #4183c4;
}

.block-header-by{
	font-weight: normal;
	color: #DDD;
}

.block-header-author{
	font-weight: normal;
	color: #555;
}

/* Home profile */
.unpadded {
	padding-left: 0;
	padding-right: 0;
}

.profile-box{
	margin-top: 20px;
	padding: 0px 20px;
	padding-bottom: 0px;
	width: 100%;
	padding-bottom: 20px;
}

#profile button.btn {
	padding-top: 10px;
	padding-bottom: 10px;
}

.profile-box h5 {
	font-weight: bold;
	text-transform: uppercase;
}

.profile-box p {
	font-size: 11pt;
	font-weight: normal;
	color: #333;
	margin: 0px;
}

.profile-pic{
	margin: auto;
	background-position: center;
	font-size: 200px;
	text-align: center;
	background-color: #eeeeee;
}

#picImg {
	vertical-align: top;
}

#profile-settings input {
	border: none;
	border-radius: 0;
	background-color: #eeeeee;
	box-shadow: none;
}

#profile-settings label {
	font-weight: normal;
	font-size: 16px;
	margin-bottom: 5px;
	margin-top: 10px;
}

/*Project items*/

.account-projects {
	margin-left: 15px;
}

.project-title{
	position: relative;
	background-color: #FFF;
	margin-bottom: 20px;
	border-radius: 3px;
  border: 1px solid;
  border-color: #DDD;
}

.project-title h2{
	color: #4183c4 !important;
	font-size: 13pt;
	font-weight: bold;
	color: #555;
	margin: 0px;
	padding: 10px;
	padding-bottom: 5px;
}

.project-title p{
	color: #333;
	margin: 0px;
	padding: 10px;
	padding-top: 0px;
}

.project-thumbnail {
	display: inline-block;
	position: relative;
	margin-bottom: -5px;
	margin-right: -1px;
	overflow: hidden;
}

#projects-thumbnails .item-masonry, .grid-sizer {
	width: calc(33.333% + 0px);
}

#projects-thumbnails .item-masonry-description {
	height: 22%;
}

#projects-thumbnails, #projects-thumbnails a {
	color: #000000;
}

#projects-thumbnails h5 {
	margin-top: 5px;
	margin-bottom: 5px;
}

p.project-owner {
	color: #666666;
}

.menu-icon{
	min-width: 17px;
	width: 17px;
	margin-right: 5px;
	opacity: 0.75;
}

.centered-button{
	margin:0px auto;
}

.project-menu{
	position: relative;
	color: #666;
	background-color: #FFF;
	margin-bottom: 20px;
	border-radius: 3px;
  border: 1px solid;
  border-color: #DDD;
}

.project-menu-section{
	position: relative;
	color: #666;
	background-color: #FFF;
	border-top: 1px solid;
	border-color: #EEE;
}

.project-menu-section h3{
	font-size: 11pt !important;
}

.project-menu-section-selected{
	background-color: #FAFAFA !important;
}

.project-menu-section:hover{
	position: relative;
	color: #666;
	background-color: #FAFAFA;
	border-top: 1px solid;
	border-color: #EEE;
}

.project-menu-section:first-child, .project-menu-section:hover:first-child{
	border-top: 0px solid;
	border-radius: 3px 3px 0px 0px;
}

.project-menu-section:last-child, .project-menu-section:hover:last-child{
	border-radius: 0px 0px 3px 3px;
}

.project-menu-section h3{
	font-size: 13pt;
	height: 100%;
	font-weight: normal;
	color: #555;
	margin: 0px;
	padding: 10px;
}

.project-title-updated p{
	color: #AAA;
	position: absolute;
  bottom: 0;
  margin-bottom: 0px;
}

/* Place holders */

.placeholder-screenshot-large{
	background-color: #004594 !important;
	height: 600px;
	box-shadow: inset  0  8px 18px -8px #000, inset  0 -8px 18px -8px #000;
	border: none;
	display: block;
}

.iframe-placeholder-screenshot-large {
	z-index: -1;
}

.placeholder-screenshot{
	background-color: #004594 !important;
	min-height: 300px;
	width: 100%;
}

/* Form */

.standardform{
	padding: 20px 10px;
}

.margined{
	margin-bottom: 10px;
}

.permission{
	padding-left: 0px;
}

.radio-pad{
	padding-left: 20px;
	margin-bottom: 0px !important;
}

.radio-pad p{
	margin: 0px;
	padding: 0px;
	color:#AAA;
}

/* Revisions */

.month-block{
	margin-left: 20px;
	padding-right: 20px;
	padding-left: 0px;
	border-left: 3px solid #444;
}

.month-block:last-child{
	margin-bottom: 10px;
}

.month-block h3{
	font-weight: normal;
	font-size: 10pt;
}

.menu-button{
 margin-bottom: 20px;
}


.button-title{
	font-size: 11pt;
	height: 100%;
	font-weight: bold !important;
	color: #555;
}

.button-keyword{
	font-size: 11pt;
	height: 100%;
	font-weight: bold !important;
	color: #4183c4;
}

.float-right{
	float: right;
}

/*.history-block{
	margin-left: 20px;
	padding-right: 40px;
	padding-left: 0px;
}

.history-block h3{
	font-weight: normal;
	font-size: 10pt;
}*/

#myChart{

}

.log{
	margin-left: 10px;
	padding-right: 10px;
	padding-left: 0px;
	margin-bottom: 10px;
}

.log-icon-block{
	float: left;
	line-height: 42px;
	min-height: 42px;
	min-width: 42px;

}

.log-icon{
	min-width: 32px;
	width: 32px;
	height: 32px;
	margin-right: 5px;
	opacity: 0.75;
	vertical-align: middle;
	text-align: center;
}

.log-block{

	background-color: #FFF;

	min-height: 40px;
	margin: 0px 10px;
	margin-left: 42px;
	border: 1px solid #EEE;
}

.log-block p{
	padding:0px;
	padding-left: 10px;
	padding-bottom: 10px;
	font-size: 10pt;
}

.commit-block{
	background-color: #FFF;
	min-height: 40px;
	margin: 10px;
	border: 1px solid #EEE;
}

.commit-block p{
	padding:0px;
	padding-left: 10px;
	padding-bottom: 10px;
	font-size: 10pt;
}

.commit-revision{
	font-weight: bold;
	font-size: 10pt;
	line-height: 40px;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 10px;
	color: #555;
}

.commit-number{
	font-weight: bold;
	font-size: 10pt;
	line-height: 40px;
	padding-top: 0px;
	padding-bottom: 0px;
	color: #4183c4;
}

.commit-by{
	font-weight: normal;
	font-size: 10pt;
	line-height: 40px;
	padding-top: 0px;
	padding-bottom: 0px;
	color: #DDD;
}

.commit-author{
	font-weight: normal;
	font-size: 10pt;
	line-height: 40px;
	padding-top: 0px;
	padding-bottom: 0px;
	color: #555;
}

.commit-date{
	float: right;
	font-weight: normal;
	font-size: 10pt;
	line-height: 40px;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-right: 10px;
	color: #888;
}

.commit-date-title{
	float: right;
	font-weight: normal;
	font-size: 10pt;;
	padding-top: 0px;
	padding-bottom: 0px;
	color: #888;
}

.comment-keyword-title{
	font-weight: normal;
	font-size: 10pt;;
	padding-top: 0px;
	padding-bottom: 0px;
	color: #888;
}

.comment-date-title{
	float: right;
	font-weight: normal;
	font-size: 10pt;;
	padding-top: 0px;
	padding-bottom: 0px;
	color: #888;
}

.history-author{
	font-weight: bold;
	font-size: 10pt;
	line-height: 40px;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 10px;
	color: #555;
}

.history-action{
	font-weight: normal;
	font-size: 10pt;
	line-height: 40px;
	padding-top: 0px;
	padding-bottom: 0px;
	color: #555;
}

.history-keyword{
	font-weight: bold;
	font-size: 10pt;
	line-height: 40px;
	padding-top: 0px;
	padding-bottom: 0px;
	color: #4183c4;
}

hr.fancy-line {
	float: left;
  border: 0;
  height: 3px;
  min-width: 10px;
  color: #111;
	background-color: #444;
	margin-right: 5px;
	margin-top: 17px;
 }

/* Dashboard */
.margin-bottom{
	margin-bottom: 20px;
}

.project-line{
	border-bottom: 1px solid;
	border-color: #DDD;
}

.project-line:last-child{
	border-bottom: 0px solid;
}

/* Loading */
img.loading{
	margin-left: auto;
	margin-right: auto;
	display: block;
}

.signin {
	max-width: 330px;
	padding: 15px;
	margin: 0 auto;
}

.signin-header {
	margin-bottom: 10px;
	width: 100%;
}

#loginButton {
	width: 100%;
	max-width: 330px;
}

/* Signup */
.uservalidbad {
	background-color: lightcoral;
}

.uservalidgood {
	background-color: lightgreen;
}

.formStyle {
	border-style: solid;
	border-width: 1px;
	border-color: #DDD;
}

.errorMessage {
	color: lightcoral;
}

/***** UIv2 elements *****/
button, button.btn {
	border-radius: 0;
	text-transform: uppercase;
	border: none;
}

.btn-primary, .btn-primary.active, .btn-primary.focus, .btn-primary:active, .btn-primary:focus, .btn-primary:hover, .open > .dropdown-toggle.btn-primary {
	background-color: rgba(5, 58, 165, 1.0);
}

header button.btn {
	background: none;
	font-size: 14pt;
	padding-top: 2px;
}

.btn-profile {
	width: 140px;
}

.form-control {
	border-radius: 0;
}

#icons {
	position: fixed;
	bottom: 0px;
	right: 0px;
}

#ui2-leftpanel {
	position: fixed;
	width: 25%;
	bottom: 0px;
	left: 0;
	height: calc(100% - 60px);
	margin-top: 60px;
	background-color: rgba(255, 255, 255, 0.5);
	-webkit-transition: all linear 0.05s;
	transition: all linear 0.05s;
	overflow-y: auto;
}

#ui2-leftpanel.collapsed {
	left: -25%;
	overflow-y: inherit;
}

.panel-collapse-btn {
	color: #ffffff;
	background-color: rgb(45, 45, 45);
	width: 40px;
	height: 40px;
	padding-top: 6px;
	text-align: center;
	font-size: 14pt;
	position: relative;
	top: 50%;
	-webkit-transition: all linear 0.05s;
	transition: all linear 0.05s;
	z-index: 10000;
}

#ui2-leftpanel-collapse-btn i {
	margin-top: 5px;
}

.collapsed #ui2-leftpanel-collapse-btn {
	right: -40px;
}

#ui2-rightpanel {
	position: fixed;
	bottom: 0px;
	width: 25%;
	right: 0;
	height: calc(100% - 60px);
	margin-top: 60px;
	background-color: rgba(255, 255, 255, 0.5);
	-webkit-transition: all linear 0.05s;
	transition: all linear 0.05s;
	overflow-y: auto;
}

#ui2-rightpanel.collapsed {
	right: -25%;
	overflow-y: inherit;
}

.collapsed #ui2-rightpanel-collapse-btn {
	left: -40px;
  opacity: 0;
}

#metadata {
	margin: 15px;
}

.metadata-table {
	width:100%;
}

.metadata-title, .metadata-row {
	color: #000000;
	text-shadow: none;
	font-size: 10pt;
}

.metadata-title {
	border: 0;
	font-weight: normal;
	font-size: 11pt;
}

.metadata-row {
	font-weight: 200;
}

#oculus-mode-icon {
	position: absolute;
	bottom: 0;
	left: -50px;
	width: 50px;
	height: 37px;
	padding: 10px;
	cursor: pointer;
}

#tools-menu-icon {
	position: absolute;
	bottom: 0;
	left: -100px;
	padding: 10px;
	cursor: pointer;
	color: #ffffff;
}

#map-pin-menu-icon {
	display: inline-block;
}

.tools-menu-items {
	color: #ffffff;
	padding: 10px;
	background-color: rgb(45,45,45);
}

.dropdown-submenu {
	position: relative;
}

.dropdown-submenu:hover {
	display: block;
}

.arrow-up {
	width: 0;
	height: 0;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-bottom: 10px solid rgb(45, 45, 45);
}

.arrow-down {
	width: 0;
	height: 0;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-top: 10px solid rgb(45, 45, 45);
}

.arrow-left {
	width: 0;
	height: 0;
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent;
	border-right:10px solid rgb(45, 45, 45);
	float: left;
	position: relative;
	left: -10px;
	top: 4px;
}

.arrow-right {
	width: 0;
	height: 0;
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent;
	border-left: 10px solid rgb(45, 45, 45);
	position: relative;
	left: 40px;
	top: -22px;
}

#bottom-panel {
	background-color: #ffffff;
	position: fixed;
	top: 60px;
	left: 25%;
	width: 50%;
	height: 100%;
	max-width: none;
	-webkit-transition: all linear 0.1s;
	transition: all linear 0.1s;
}

#bottom-panel.collapsed {
	top: 100%
}

.bottom-tabs {
	position: absolute;
	border: none;
	font-size: 8pt;
	top: 0;
	height: 35px;
	width: 80%;
	left: 10%;
	-webkit-transition: all linear 0.1s;
	transition: all linear 0.1s;

}

.collapsed .bottom-tabs {
	top: -35px;
}

.bottom-tabs > li {
	width: 20%;
	text-align: center;
}

.bottom-tabs > li > a, .bottom-tabs > li > a:focus, .bottom-tabs > li > a:hover,
.bottom-tabs > li.active > a, .bottom-tabs > li.active > a:focus, .bottom-tabs > li.active > a:hover {
	border-radius: 0;
	border: none;
	background-color: rgb(45, 45, 45);
	color: #ffffff;
	margin-left: 0;
	margin-right: 0;
}

.bottom-tabs > li.active::after {
	content: " ";
	width: 0;
	height: 0;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-top: 10px solid rgb(45, 45, 45);
	position: relative;
	top: 8px;
}

.bottom-info {
	padding-top: 20px;
}

.block-header-project-name {
	font-weight: normal;
}

.collapsed .bottom-tabs > li.active::after {
	border: none;
}

#nav-version-control {
	position: absolute;
	margin-right: auto;
	margin-top: 20px;
	display: inline;
	top: 0;
	z-index: 10000;
	left: 25%;
	width: 50%;
}

#nav-version-control .btn-group.menu-button {
	margin-bottom: 0;
}

#nav-version-control .btn-group.menu-button button.btn {
	border: none;
	color: #ffffff;
	padding: 0;
	margin: 0 15px;
	border-radius: 0;
	background: none;
}

#nav-version-control .btn-group.menu-button button.btn:hover {
	background: none;
}

.nav-project-title {
	color: #ffffff;
	position: absolute;
	width: 10%;
}

#revisions-selector {
	position: absolute;
	left: 75px;
	width: 90%;
}

#diffToggle {
	position: absolute;
	top: 0;
	right: 0;
}

#diffToggle a {
	color: #ffffff;
}

#diffSpan {
	border-top: 2px solid #ffffff;
	margin-top: 17px;
	padding-top: 17px;
	padding-bottom: 17px;
	background-color: rgba(5, 58, 165, 0.84);
}

.tools-menu-items li {
	white-space: nowrap; 
}

.dropdown-menu {
	border-radius: 0 !important;
	margin: auto;
}

.dropdown-menu > li > a {
	padding: 0 0;
	text-align: center;
}

.dropdown-menu > li > a > .button-keyword {
	font-size: 10pt;
	font-weight: normal !important;
	color: #000000;
	text-shadow: none;
}

/*************************************************/
/* Taken from http://jsfiddle.net/KyleMit/Buwm8/
/*************************************************/

/* Helps position submenu */
.dropdown-submenu {
	position: relative;
}
/* Menus under the submenu should show up on the right of the parent */
.dropdown-submenu > .dropdown-menu {
	max-height: 600px;
	min-width:100%;
	overflow-y: scroll;
	-webkit-border-radius:0 6px 6px 6px;
	   -moz-border-radius:0 6px 6px 6px;
			border-radius:0 6px 6px 6px;
}
/* Make submenu visible when hovering on link */
.dropdown-submenu:hover>.dropdown-menu {
	display:block;
}

/* Add carot to submenu links */
.dropdown-submenu>a:after {
	display:block;
	float:right;
	
	/*simple */
	content: "►";
	color: #cccccc;
	
	/* looks a little better */
	content:" ";
	width:0;
	height:0;
	border-color:transparent;
	border-style:solid;
	border-width:5px 0 5px 5px;
	border-left-color:#cccccc;
	margin-top:5px;
	margin-right:-10px;
}
/* Change carot color on hover */
.dropdown-submenu:hover>a:after {
	border-left-color:#ffffff;
}

/*************************************************/

#nav-version-control .btn-group.menu-button button.btn .button-title,
#nav-version-control .btn-group.menu-button button.btn .button-keyword {
	color: #ffffff;
}

#nav-version-control .btn-group.menu-button button.btn .button-keyword {
	font-weight: normal !important;
}

#nav-version-control .fa {
	margin-left: 5px;
	margin-right: 5px;
}

#nav-version-control .fa-caret-down {
	font-size: 8pt;
}

#nav-version-control span {
	margin-left: 5px;
	margin-right: 5px;
}

.cobie-spreadsheet-container img {
	margin-left: auto;
	margin-right: auto;
}

/******** FANCYTREE OVERRIDES **********/
.fancytree-selected span.fancytree-title, span.fancytree-title {
	color: #000000;
	text-shadow: none;
	font-style: normal;
}

#fancytree-drop-marker,
span.fancytree-checkbox,
span.fancytree-drag-helper-img,
span.fancytree-empty,
span.fancytree-expander,
span.fancytree-icon,
span.fancytree-radio,
span.fancytree-vline {
	background-image: url("../images/icons2.png");
}

span.fancytree-icon {
	width: 0;
}

ul.fancytree-container li {
	background: none;
}

.fancytree-folder span.fancytree-title {
	font-weight: normal;
}

/********** masonry **********/
.item-masonry, .grid-sizer {
	width: calc(25% - 1px);
	/*margin-bottom: -3px;*/
}

.item-masonry.w2 {
	width: calc(50% - 2px);
}

.item-masonry-description {
	position: absolute;
	bottom: 0;
	padding: 10px;
	background-color: rgba(255, 255, 255, 0.8);
	width: 100%;
	height: 30%;
}

#viewerMessageBox {
	margin: auto;
	top: 50%;
	left: 50%;
	position: absolute;
	text-align: center;
	color: white;
	background-color: RGBA(45,45,45,0.9);
	padding: 10px;
	max-width: 200px;
	min-width: 100px;
	z-index: 10000;
}

.readme-text {
	padding: 10px;
	min-height: 93px;
}

.readme {
	opacity: 0.9;
	margin-top:30%;
	position: absolute;
	min-width: 100px;
	min-height: 100px;
	z-index: 100;
}

#videocamera {
	width: 100%;
	height: 100%;
	position: relative;
}

.modal {
	color: white;
	overflow: hidden;
	text-align: center;
}

.modal-content {
	margin-top: 450px;
	background-color: RGBA(45,45,45,0.9) !important;
	overflow: hidden;
	margin-right: 0;
	margin-left: 0;
}

.modal-header, .modal-body, .modal-footer {
	background-color: rgb(5,58,165);
}

#Axes {
	width: 100px;
	height: 100px;
	left: 80px;
	bottom: -80px;
	position: absolute;
	border: none;
}

#clipslider {
	width: 100%;
}

#hiddensubmitbutton {
	visibility: hidden;
}

/** Walkthrough *******************************************************************************************************/
#walkthrough {
  display: block;
  position: absolute;
  bottom: 0;
  z-index: 10000;
  width: 250px;
  background: rgba(5, 58, 165, 1.0);
  padding: 10px 10px 10px 5px;
  left: 0;
  right: 0;
  margin: auto;
}

.walkthroughButtons {
  position: absolute;
  top: 10px;
  right: 0;
  margin-right: 10px;
}

.walkthroughButtons button {
  margin-left: 2px !important;
	padding: 7px 6px 3px 6px;
}

.walkthroughButtons button span {
  font-size: 18px;
}

#walkthrough .btn-toolbar button {
  padding: 5px 6px 5px 6px;
  margin-left: 4px;
}

.walkthroughButtonSelected {
  background: #999;
  color: #FFFFFF;
  outline: none;
}

.walkthroughButtonUnselected {
  background: #FFFFFF;
  color: #000000;
  outline: none;
}

/** Viewing ***********************************************************************************************************/
#viewing {
  display: block;
  position: absolute;
  top: 17px;
  right: 320px;
  z-index: 10000;
}

.viewingButtonSelected {
  background: #999;
  color: #FFFFFF;
  outline: none;
  margin-left: 6px;
}

.viewingButtonUnselected {
  background: #FFFFFF;
  color: #000000;
  outline: none;
  margin-left: 6px;
}

#accountpage {
	height: inherit;
	overflow-y: scroll;
}

/** VR Demo ***********************************************************************************************************/
#instructionCircle {
	position: absolute;
	z-index: 4;
	text-align: center;
	left: 0;
	right: 0;
	top: 50%;
	height: auto;
	width: 40%;
	transform: translateY(-50%);
	border-radius: 50%;
	margin: auto;
	padding-bottom: 10%;
	background-color: rgb(255, 255, 255);
	
}

#instructionImage {
	width: 80%;
	margin-top: 15%;
}

#instructionOK {
	font-size: 400%;
	font-variant: small-caps;
	margin-top: 10%;
	margin-bottom: -20%;
}

.VRDemoMenuItem {
	height: 50%;
	text-align: center;
	vertical-align: middle;
	transform: translateY(50%);
	font-size: 400%;
	cursor: pointer;
	font-variant: small-caps;
}

.fullheight {
	margin: auto;
	height: 100%;
}